﻿@{
	ViewBag.Title = "SysUserRightManage";
	Layout = "~/Views/Shared/_Layout.cshtml";
	
}
@model OASys.Web.Areas.ModuleSys.Models.ModelSysUserRightManageIndex
<style type="text/css">
	#content
	{
		border: 1px solid #ccc;
	}
	#content-fixed
	{
		width: 650px;
	}
	.content-left
	{
		border-right: 1px solid #ccc;
		width: 250px;
		height: 100%;
		float: left;
		text-align: center;
	}
	.content-left #leftTree, .content-right #rightTree
	{
		float: left;
		margin: 1px 0 0 0;
		width: 200px;
		background: #fff;
		padding: 10px 0 0 0;
	}
	.content-middle
	{
		border-right: 1px solid #ccc;
		width: 110px;
		height: 100%;
		float: left;
		text-align: center;
	}
	.content-middle .move01
	{
		background: url("/Content/Images/move01.jpg") no-repeat;
		margin-top: 100px;
	}
	.content-middle .move02
	{
		background: url("/Content/Images/move02.jpg") no-repeat;
	}
	.content-middle .move03
	{
		background: url("/Content/Images/move03.jpg") no-repeat;
	}
	.content-middle .move04
	{
		background: url("/Content/Images/move04.jpg") no-repeat;
	}
	.content-middle input
	{
		border: 0px;
		width: 54px;
		height: 25px;
		margin: 10px;
		cursor: pointer;
	}
	.content-right
	{
		border-right: 1px solid #ccc;
		width: 250px;
		height: 100%;
		float: left;
		text-align: center;
	}
	.tree-content
	{
		width: 250px;
		height: 100%;
		overflow: auto;
		text-align: left;
	}
</style>
<script type="text/javascript">
    $(function () {
        $("#content").height($("html").outerHeight() - 10).width("100%");
        $(".tree-content").height($("html").outerHeight() - 30);
        $("#content-fixed").height($("html").outerHeight() - 10);

        /* 初始化树
        ----------------------------------------------------------*/
        var tree = $("#leftTree,#rightTree").jstree({
            ui: { theme_name: "checkbox" },
            lang: {
                loading: "目录加载中……"  //在用户等待数据渲染的时候给出的提示内容，默认为loading
            },
            "types": {
                "valid_children": ["root"],
                "types": {
                    "root": {
                        "icon": {
                            "image": "/Content/images/ico0.jpg"
                        },
                        "valid_children": ["default"],
                        "max_depth": 2,
                        "hover_node": false,
                        "select_node": function () { }
                    },
                    "default": {
                        "valid_children": ["default"],
                        "icon": {
                            "image": "/Content/images/ico1.jpg"
                        }
                    }
                }
            },
            "plugins": ["themes", "html_data", "ui", "types", "checkbox"]
        });

        //open_node,
        tree.bind("loaded.jstree", function (event, data) {
            tree.jstree("open_all");

            $("#rightTree .node1").each(function () {
                $(this).find("a[user-extra-right='false']").each(function () {
                    $(this).parent().attr("id", "");
                    $(this).children().remove();
                })
                $(this).find("a[node='2']").each(function () {
                    if ($(this).parent().find("a[user-extra-right='true']").length == 0) {
                        $(this).parent().attr("id", "");
                        $(this).children().remove();
                    }
                })
                if ($("#rightTree .node1").find("a[user-extra-right='true']").length == 0) {

                    $(this).find("a[node=1]").children().remove();
                }
            })

        }).bind("open_node.jstree", function (event, data) {
            $("#rightTree .node1").each(function () {
                $(this).find("a[user-extra-right='false']").each(function () {
                    $(this).parent().attr("id", "");
                    $(this).children().remove();
                })
                $(this).find("a[node='2']").each(function () {
                    if ($(this).parent().find("a[user-extra-right='true']").length == 0) {
                        $(this).parent().attr("id", "");
                        $(this).children().remove();
                    }
                })
                if ($("#rightTree .node1").find("a[user-extra-right='true']").length == 0) {

                    $(this).find("a[node=1]").children().remove();
                }
            })
        })
    })

    //全部向右移动
    function leftMoveAll(operateType) {
        // 存放所有菜单id
        var arrayId = new Array();
        //未选中菜单id
        $("#leftTree").jstree("get_unchecked", null, true).each(function (i, n) {
            if (n.id != "") {
                arrayId.push(n.id);
            }
        });
        //已选中菜单id
        $("#leftTree").jstree("get_checked", null, true).each(function (i, n) {
            if (n.id != "") {
                arrayId.push(n.id);
            }
        });

        submitMoveMenu(arrayId, operateType);
    }

    //提交
    function submitMoveMenu(arrayId, operateType) {
        //如果没有选中否不操作
        if (arrayId.length < 1) {
            return;
        }
        //添加到页面进行提交
        for (var i = 0; i < arrayId.length; i++) {
            $(".moveId").append('<input type="hidden" name="menuGuid" value="' + arrayId[i] + '" />');
        }

        $(".moveId").append('<input type="hidden" name="operateType" value="' + operateType + '" />');
        $("form").attr("action", "/ModuleSys/SysUserRightManage/MoveRoleMenu/").submit();
    }

    //选中项向右移动
    function leftMoveSelectItem(operateType) {
        // 存放所有菜单id
        var arrayId = new Array();
        //已选中菜单id
        $("#leftTree").jstree("get_checked", null, true).each(function (i, n) {
            if (n.id != "") {
                arrayId.push(n.id);
            }
        });

        submitMoveMenu(arrayId, operateType);
    }

    //全部向左移动
    function rightMoveAll(operateType) {
        // 存放所有菜单id
        var arrayId = new Array();
        //未选中菜单id
        $("#rightTree").jstree("get_unchecked", null, true).each(function (i, n) {
            if (n.id != "") {
                arrayId.push(n.id);
            }
        });
        //已选中菜单id
        $("#rightTree").jstree("get_checked", null, true).each(function (i, n) {
            if (n.id != "") {
                arrayId.push(n.id);
            }
        });
        submitMoveMenu(arrayId, operateType);
    }

    //选中项各大左移动
    function rightMoveSelectItem(operateType) {
        // 存放所有菜单id
        var arrayId = new Array();
        //已选中菜单id
        $("#rightTree").jstree("get_checked", null, true).each(function (i, n) {
            if (n.id != "") {
                arrayId.push(n.id);
            }
        });

        submitMoveMenu(arrayId, operateType);
    }
</script>
@using (Html.BeginForm("MoveRoleMenu", "SysUserRightManage", FormMethod.Post))
{
	@Html.HiddenFor(x => x.UserId)
	<div class="moveId">
	</div>
	<div class="tabs-container">
		<ul>
			<li id="current" class="tabActive"><a><span>分配权限</span></a></li>
		</ul>
	</div>
	<div id="content">
		<div id="content-fixed">
			<div class="content-left">
				<img src="/Content/Images/wfq-Role.gif" />
				<div class="tree-content">
					<div id="leftTree">
						<ul>
							@foreach (var node1 in Model.NonAssignedRoleMenuParent)
       {
           if (node1.Level == 1)
           {
								<li><a href="javascript:void(0)">@node1.Name</a>
									@foreach (var node2 in Model.NonAssignedRoleMenuParent)
         {
             if (node2.Level == 2 && node2.ParentID == node1.ID)
             {
										<ul>
											<li><a href="javascript:void(0)">@node2.Name</a>
												@foreach (var node3 in Model.NonAssignedRoleMenu)
            {
                if (node3.Level == 3 && node3.ParentID == node2.ID)
                {
													<ul>
														<li id="@node3.ID"><a href="javascript:void(0)">@node3.Name</a> </li>
													</ul>
                }
            }
											</li>
										</ul>
             }
         }
								</li>
           }
       }
						</ul>
					</div>
				</div>
			</div>
			<div class="content-middle">
				<input type="button" value="" class="move01" onclick="leftMoveAll('@Project.Common.EnumDirection.Left');" /><br />
				<input type="button" value="" class="move02" onclick="leftMoveSelectItem('@Project.Common.EnumDirection.Left')" /><br />
				<input type="button" value="" class="move04" onclick="rightMoveSelectItem('@Project.Common.EnumDirection.Right');" /><br />
				<input type="button" value="" class="move03" onclick="rightMoveAll('@Project.Common.EnumDirection.Right');" />
			</div>
			<div class="content-right">
				<img src="/Content/Images/yfq-Role.gif" />
				<div class="tree-content">
					<div id="rightTree">
						<ul>
							@foreach (var node1 in Model.AssignedRoleMenuParent)
       {
           if (node1.Level == 1)
           {
								<li class="node1"><a href="javascript:void(0)" node="1">@node1.Name</a>
									<ul>
										@foreach (var node2 in Model.AssignedRoleMenuParent)
          {
              if (node2.Level == 2 && node2.ParentID == node1.ID)
              {
							
											<li><a href="javascript:void(0)" node="2">@node2.Name</a>
												<ul>
													@foreach (var node3 in Model.AssignedRoleMenu)
             {
                 if (node3.Level == 3 && node3.ParentID == node2.ID)
                 {
												
														<li id="@node3.ID"><a href="javascript:void(0)" @(Model.UserMenu.FirstOrDefault(x => x.ID == node3.ID) == null ? "user-extra-right=false" : "user-extra-right=true")>@node3.Name</a>
														</li>
												
                 }
             }
												</ul>
											</li>
							
              }
          }
									</ul>
								</li>
           }
       }
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
}
